<!--  -->
<template>
  <!-- 顶部 -->
  <div class="qf-cart">
    <van-nav-bar class="Cart-nav-b" title="购物车" left-text="返回" left-arrow fixed @click-left="back">
      <template #right>
        <van-icon name="search" size="18" />
      </template>
    </van-nav-bar>
    <!-- 商品列表 -->
    <div>
      <van-card
        num="2"
        price="2.00"
        desc="描述信息"
        title="商品标题"
        thumb="https://img.yzcdn.cn/vant/ipad.jpeg"
      >
       
        <template #footer>
          <van-button size="mini">-</van-button>
          <van-button size="mini">+</van-button>
        </template>
      </van-card>
    </div>
    <!-- 提交 -->
    <van-submit-bar :price="3050" button-text="提交订单" @submit="onSubmit">
      <van-checkbox v-model="checked">全选</van-checkbox>
      <template #tip>
        你的收货地址不支持同城送,
        <span @click="skipToAdor">修改地址</span>
      </template>
    </van-submit-bar>

    <QfTabbar></QfTabbar>
  </div>
</template>

<script>
import { Card, NavBar, Icon, SubmitBar, Checkbox,Button } from "vant";
import QfTabbar from '../../components/common/QfTabbar'
export default {
  name: "Cart",
  data() {
    return {
      checked: false,
    };
  },
  components: {
       QfTabbar,
    [Card.name]: Card,
    [NavBar.name]: NavBar,
    [Icon.name]: Icon,
    [SubmitBar.name]: SubmitBar,
    [Checkbox.name]: Checkbox,
    [Button.name]:Button,

  },
  methods: {
    //返回上一页
    back() {
        
      this.$router.back();
    },
    //提交购物车
    onSubmit() {
      console.log("提交购物车");
    },
    //跳转到地址修改页面
    skipToAdor() {
      // this.$erouter.push("addr")
    },
  },
};
</script>
<style lang='scss' scoped>
.Cart-nav-b{
    background: #E6E6E6;
}
.van-submit-bar {
  margin-bottom: 1.333333rem;
}
.qf-cart{
    padding-top: 1.226667rem;
}
</style>